<template>
	<view class="wallet">
		<div class="van-nav-bar van-nav-bar--fixed">
			<div class="van-nav-bar__content">
				<div class="van-nav-bar__title van-ellipsis" style="margin-left: 66rpx;color: #fff;">{{common.wallet.default[0]}}</div>
				<div class="van-nav-bar__left" @tap="retuPage">
					<u-icon name="arrow-left" color="#fff" size="32rpx"></u-icon>
				</div>
			</div>
		</div>
		
		<view class="new-top">
			<view class="new-top-item">
				<view class="new-top-title">
					USDT
				</view>
				<view class="new-top-tips">
					{{common.wallet.default[8]}}
				</view>
				<view class="new-top-money">
					{{showMoney?userinfo.money:"***"}}
				</view>
				<view class="new-top-btn" @tap="dumprun('/pages/setting/mixrecharge')">
					{{common.wallet.default[1]}}
				</view>
			</view>
		</view>
		
		<view class="new-center">
			<view class="new-c-top">
				<text>{{common.table[17]}}</text>
				<span @click="showMoney=!showMoney">{{showMoney?common.table[19]:common.table[18]}}</span>
			</view>
			<view class="new-c-itenm" v-for="(item, index) in list" :key="index">
				<image :src="item.img" mode=""></image>
				<text>{{item.name}}</text>
				{{showMoney?item.money:"***"}}
			</view>
				
			</uni-view>
		</view>

		<!-- <view class="wallet_tab">
			<view class="fl">
				<text>
					{{common.wallet.default[8]}}(USDT)
				</text>
				<text>
					{{userinfo.money}}
				</text>
			</view>
			<view class="fr" @tap="dumprun('/pages/setting/mixrecharge')">
				{{common.wallet.default[1]}}
			</view>
		</view> -->

		<!-- <view class="wallet_list">
			<uni-view data-v-70302438="" style="padding-left: 10px; padding-right: 10px;" v-for="(item, index) in list">
				<uni-view data-v-70302438=""
					style="display: flex; justify-content: space-between; padding-top: 12px; padding-bottom: 12px; border-bottom: 1px solid rgb(69, 69, 69);"><uni-view
						data-v-70302438="" style="display: flex;">
						<uni-image data-v-70302438=""
							style="width: 22px; height: 22px; border-radius: 22px; margin-right: 10px;">
							<div :style="{ backgroundImage: 'url(' + item.img + ')' }" class="imgss"></div>
							<img :src="item.img" >
						</uni-image>
						<uni-view data-v-70302438="">
							<uni-view data-v-70302438="" style="font-size: 14px; margin-bottom: 7px;">{{item.name}}</uni-view>
								<uni-view data-v-70302438="" style="font-size: 12px; opacity: 0.5;">{{item.name}}</uni-view>
							</uni-view>
						</uni-view>
					<uni-view data-v-70302438="">{{item.money}}</uni-view>
				</uni-view>
				
			</uni-view> -->
			<!-- <view class="wallet_item">
				<text>{{common.wallet.default[5]}}(USDT)</text>
				<text>+{{userinfo.Recharge_money }}</text>
			</view> -->
			<!-- <view class="wallet_item" 
			>
				<text>{{common.wallet.default[5]}}(USDT)</text>
				<text>+{{userinfo.Recharge_money }}</text>
			</view>	
			
			<view class="wallet_item"
			>
				<text>{{common.wallet.default[6]}}(USDT)</text>
				<text>+{{userinfo.interest_wallet }}</text>
			</view>	
			
			<view class="wallet_item"
			>
				<text>{{common.wallet.default[7]}}(USDT)</text>
				<text>+{{userinfo.sell_money}}</text>
			</view>	 -->

			<!-- <empty :promptText="common.empty[0]" :showEmpty="accountList.length == 0" /> -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userinfo: {},
				list:[],
				accountForm: {
					page: 1,
					list: 999
				},
				showMoney:true
			}
		},
		onShow() {
			// this.getAccountList()
			this.getuserinfo()
			this.balances()
		},
		computed: {
			common() {
				return this.$t("common")
			},
		},
		methods: {
			balances(){
				const token = uni.getStorageSync('token')
				this.$u.api.index.balances(token).then(res => {
					this.list = res.data;
				
				})
			},
			retuPage() {
				uni.navigateBack(-1)
			},
			dumprun(url) {
				uni.navigateTo({
					url
				})
			},

			getAccountList() {
				const token = uni.getStorageSync('token');
				this.$u.api.index.revenueExpenditure(token, this.accountForm).then(res => {
					if (res.code == 1) {
						console.log(res.data)
						this.accountList = res.data
					}
				})
			},

			getuserinfo() {
				const token = uni.getStorageSync('token')
				this.$u.api.index.getUserinfo(token).then(res => {
					this.userinfo = res.data
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.imgss{
		background-position: 0% 0%;background-size: 100% 100%;background-repeat: no-repeat;
	}
	.wallet {
		padding-top: 80rpx;
		background-color: #2A2D34;
		min-height: 100vh;

		.van-nav-bar__content {
			background-color: #1a1a1a !important;
		}

		.wallet_tab {
			display: flex;
			align-items: center;
			margin: 0 30rpx;
			padding: 20rpx;
			height: 140rpx;
			border-radius: 16rpx;
			background-color: #03E4DF;

			.fl {
				flex: 1;
				display: flex;
				justify-content: space-around;
				flex-direction: column;

				&>text:nth-child(2) {
					font-size: 32rpx;
					font-weight: 700;
				}
			}

			.fr {
				padding: 0 50rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				color: #03E4DF;
				height: 70rpx;
				background-color: #3b3b3b;
				border-radius: 12rpx;
			}
		}

		.wallet_list {
			margin-top: 20rpx;

			.wallet_item {
				padding: 0 20rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 10rpx;
				height: 100rpx;
				font-weight: 700;
				background-color: #fff;

				&>text:last-child {
					color: #ed742e;
				}
			}
		}
	}
	.new-top{
		width: 750rpx;
		height: 318rpx;
		background: #222328;
		padding: 24rpx 30rpx;
		box-sizing: border-box;
		.new-top-item{
			width: 100%;
			height: 100%;
			background-image: url('../../static/image/my/zcbj.png');
			background-size: 100% 100%;
			padding: 38rpx 16rpx;
			box-sizing: border-box;
			position: relative;
			.new-top-title{
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				font-size: 36rpx;
				color: #FFFFFF;
			}
			.new-top-tips{
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #AAD7D8;
			}
			.new-top-money{
				margin-top: 40rpx;
				font-family: WeChat Sans Std, WeChat Sans Std;
				font-weight: bold;
				font-size: 48rpx;
				color: #FFFFFF;
			}
			.new-top-btn{
				position: absolute;
				top: 38rpx;
				right: 16rpx;
				width: 120rpx;
				height: 72rpx;
				background: #99FFFD;
				border-radius: 120rpx 120rpx 120rpx 120rpx;
				text-align: center;
				line-height: 72rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #000000;
			}
		}
	}
	
	.new-center{
		margin-top: 74rpx;
		width: 750rpx;
		height: 630rpx;
		background: #222328;
		padding: 0 28rpx;
		.new-c-top{
			height: 102rpx;
			display: flex;
			align-items: center;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 26rpx;
			color: #666C75;
			text{
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				font-size: 32rpx;
				color: #FFFFFF;
				flex: 1;
			}
		}
		.new-c-itenm{
			height: 88rpx;
			display: flex;
			align-items: center;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			font-size: 30rpx;
			color: #FFFFFF;
			border-bottom: 1rpx solid #2A2D34;
			image{
				width: 44rpx;
				height: 44rpx;
			}
			text{
				flex: 1;
				margin-left: 16rpx;
				font-weight: 400;
			}
		}
	}
</style>